<template>
  <div>
    <div class="model-title-css">
      <div class="title">考核评分</div>
    </div>
    <div class="background_wrap">
      <div class="operate_wrap flexDiv">
        <div class="flex-left">
          <el-button type="primary" size="small" class="add buildButtonStyle" round @click="showDetailDialog('build', '项目信息新增')">
            <i class="iconfont icon-icon_add"></i>&nbsp;新增
          </el-button>
        </div>
        <div class="flex-right">
          <el-date-picker v-model="search.year" value-format="yyyy" type="year" placeholder="选择年" @change="getList(true)">
          </el-date-picker>
          <el-select placeholder="季度" size="small" class="half" v-model="search.assessmentDuration" filterable clearable @change="getList(true)">
            <el-option v-for="item in assessmentDurationOptions" :key="item.label" :label="item.label" :value="item.value">
            </el-option>
          </el-select>

          <!-- 项目名称 -->
          <el-select class="select" size="small" v-model="search.projectId" clearable filterable @change="changeProject" placeholder="选择项目名称">
            <el-option v-for="(item,index) in projectTree" :key="index" :label="item.name" :value="item.id">
            </el-option>
          </el-select>
          <!-- 标段 -->
          <el-select class="select" size="small" v-model="search.sectionId" clearable filterable @change="getList(true)" placeholder="选择标段">
            <el-option v-for="(item,index) in sectionTree" :key="index" :label="item.name" :value="item.id">
            </el-option>
          </el-select>

          <!-- <el-input class="input" size="small" v-model="search.assessmentTeam" placeholder="请输入项目名称" clearable @change="getList(true)"></el-input> -->
          <!-- <el-select placeholder="考核班组" size="small" class="half" v-model="search.assessmentTeam" filterable clearable>
            <el-option v-for="item in constructionTeamList" :key="item.name" :label="item.name" :value="item.id">
            </el-option>
          </el-select> -->
          <el-button class="search" size="small" @click="quarterAward.show = true">奖惩信息
          </el-button>
          <el-button class="search" size="small" @click="getList(true)"><i class="iconfont icon-sousuo"></i>
            搜索</el-button>
          <!-- <el-button class="search reset" size="small" @click="resetSearch"><i class="iconfont icon-zhongzhi-xiao"></i>
            重置</el-button> -->
        </div>
      </div>

      <div class="list_wrap WholeScroll">
        <div class="grid-box">
          <div class="grid-one" v-for="(item,index) in list" :key="'list'+index">
            <div class="grid-content">
              <div class="gridA">
                <img style="width: 42px;" src="@/assets/iconfont/img.png" alt="">
                <div class="grid-1">
                  <div style="">{{item.year + item.assessmentTeam +' '+ item.assessmentDuration + '考核'}}</div>
                  <div v-if="item.projectId||item.sectionId">
                    <span>{{item.projectId&&projectTreeStr[item.projectId]?projectTreeStr[item.projectId]:''}}</span>
                    <span>{{item.sectionId?(sectionTreeStr[item.sectionId]?sectionTreeStr[item.sectionId]:''):''}}</span>
                  </div>
                </div>
                <div class="score">{{ item | totalScore }}分</div>
              </div>
              <div class="gridB">
                <div>创建时间 : {{item.createTime}}</div>
                <div>创建人 : {{item.creatUser}}</div>
              </div>
            </div>

            <div class="grid-footer">
              <el-button type="primary" size="small" plain @click="openDialogTableFormButtn(0,item)">查询</el-button>
              <el-button type="primary" size="small" plain @click="openDialogTableFormButtn(1,item)">编辑</el-button>
              <el-button type="danger" size="small" plain @click="openDialogTableFormButtn(2,item)">删除</el-button>
            </div>
          </div>
        </div>
      </div>

    </div>
    <Detail :postDetail="postDetailData" @reloadList="getList(true)"></Detail>
    <quarter-award v-model="quarterAward.show"></quarter-award>
  </div>
</template>
<script>
import msgUtil from "@/utils/msgUtil";
import assessment from '@/api/buss/assessment'
const urlBussBase = "bussassessment";
import crudDict from "@/api/system/dict";
import projectSectionInfo from '@/api/buss/common'
import publicSearchData from '@/mixins/publicSearchData'
export const totalScoreFilter = function (item) {
  const f = [
    'xczlbztjScore', 'zljlScore', 'sczbScore', 'zlggScore', 'aqzrsgScore', 'aqzrzScore',
    'aqjyScore', 'aqjcScore', 'sgjdScore', 'sgjdwcqkScore', 'sgjscsfaScore', 'cbhglkzScore',
    'lxjyjdqkScore', 'jszjjdglScore', 'gfgcjsglScore', 'bzzgscshtjScore', 'jhgdxtScore',
    'kzxcgzScore', 'hjbhScore', 'shqdhjbhScore'
  ]
  let score = 0
  f.forEach(key => {
    let temp = Number(item[key])
    if (isNaN(temp)) {
      temp = 0
    }
    score += temp
  })
  // console.log(score)
  return Number(score.toFixed(4))
}

export const assessmentDurationOptions = [
  { label: '第一季度', value: '第一季度' },
  { label: '第二季度', value: '第二季度' },
  { label: '第三季度', value: '第三季度' },
  { label: '第四季度', value: '第四季度' },
]

export default {
  mixins: [publicSearchData],
  name: "assessment-score",
  components: {
    Detail: require('./assessment-score-detail/assessment-score-detail.vue').default,
    quarterAward: require(`./quarter-award-manage/quarter-award-manage`).default,
  },
  data() {
    return {
      quarterAward: {
        show: false
      },
      searchInitialization: {
        pageIndex: 0
      },
      search: {
        assessmentTeam: '',
        year: '',
        pageSize: 999999,
        pageIndex: 0,
        assessmentDuration: '',
        projectId: '',
        sectionId: ''
      },
      assessmentDurationOptions: assessmentDurationOptions,
      constructionTeamList: [],
      list: [],
      postDetailData: {
        show: false,
        type: 'build'
      },
      projectTree: [],
      projectTreeStr: {},//项目处理
      sectionTree: [],
      sectionTreeStr: {},//标段处理
    }
  },
  activated() {
    setTimeout(() => {
      let routeActive = this.$route.meta.active
      let toContinue = true
      this.$store.state.allNavigations.forEach(item => {
        if (routeActive[0].toString() === item.index) {
          if (item.default) {
            this.$store.state.asideShow = false
          } else {
            this.$store.state.asideShow = true
          }
          for (let j = 0; j < item.children.length; j++) {
            let child = item.children[j]
            if (child.path === this.$route.path && child.default) {
              if (child.default) {
                toContinue = false
              } else {
                toContinue = true
              }
              break
            }
          }
        }
      })
      // 如果缺省
      if (!toContinue) {
        this.$store.state.childDefaultShow = true
        return
      } else {
        this.$store.state.childDefaultShow = false
      }
      /*   // 获取拆迁类型
         this.getTypeList()
         this.getlandTypeList()*/
      // 获取列表
      this.getList()
    }, 10)
    // this.getList()
  },

  beforeCreate() {
    // 默认展示列表
    this.$store.state.asideClick = true
  },

  created() {
    //this.getConstructionTeam();
    this.getProjSecTreeAll()
  },
  methods: {
    changeProject() {
      if (this.search.sectionId) { this.search.sectionId = '' }
      this.sectionTree = []
      for (let i = 0; i < this.projectTree.length; i++) {
        if (this.projectTree[i].id == this.search.projectId) {
          this.sectionTree = this.projectTree[i].children
          break;
        }
      }
      this.getList(true)
    },
    resetSearch() {
      this.search = {
        assessmentTeam: '',
        year: '',
        pageSize: 999999,
        pageIndex: 0,
        assessmentDuration: ''
      }
      this.getList(true)
    },
    getList(reload) {
      assessment.listPage(this.search).then(res => {
        if (res.code == 200) {
          this.list = res.data.content
          this.search.total = res.data.totalElements
        } else {
          msgUtil.error2(res.data.message)
        }
      })
    },
    openDialogTableFormButtn(index, row) {
      switch (index) {
        // 查看
        case 0:
          this.postDetailData = {
            show: true,
            type: 'check',//check  edit del commit build
            typeNmae: '查看',
            detailId: row.id
          }
          break
        // 编辑
        case 1:
          this.postDetailData = {
            show: true,
            type: 'edit',//check  edit del commit build
            typeNmae: '编辑',
            detailId: row.id
          }
          break
        //删除
        case 2:
          const ids = []
          ids.push(row.id)
          this.del(ids)
          break
      }

    },
    showDetailDialog(flag, params) {
      console.log(flag, params)
      switch (flag) {
        case 'build':
          this.postDetailData = {
            show: true,
            type: 'build',
            params: params
          }
          break
        case 'update':
          this.postDetailData = {
            show: true,
            type: 'edit',
            params: params
          }
          break
        case 'show':
          this.postDetailData = {
            show: true,
            type: 'check',
            params: params
          }
          break
        case 'history':
          this.postDetailData = {
            show: true,
            type: 'history',
            params: params
          }
          break
        case 'download':
          this.postDetailData = {
            show: true,
            type: 'download',
            params: params
          }
          break
        case 'supervise':
          // this.postDetailData = {
          //     show: true,
          //     type: 'check',
          //     params: params
          // }

          break
      }
    },
    getProjSecTreeAll() {
      projectSectionInfo.getProjSecTreeAll().then(res => {
        if (res.code === 200) {
          console.log(res)
          this.$set(this, 'projectTree', res.data)
          if (this.$headerSearch) {
            this.$set(this.search, 'projectId', this.changeHeaderProject)
            this.getList(true)
          }
          let arr = res.data
          for (let i = 0; i < arr.length; i++) {
            this.$set(this.projectTreeStr, arr[i].id, arr[i].name)
            if (arr[i].children.length) {
              arr[i].children.map(e => {
                this.$set(this.sectionTreeStr, e.id, e.name)
              })
            }
          }
        } else {
          this.$messageError(res.data.message)
        }
      }).catch(() => {
        this.$messageError('获取项目标段树失败')
      })
    },
    getConstructionTeam() {

      crudDict.getByCode('constructionTeam').then(res => {
        if (res.code == 200) {
          this.constructionTeamList = res.data
          this.getList()
        }
      })

    },
    handleClickDeal(res, rowType) {
      console.log(res)
      let type = rowType
      let detailId = res.detailId
      let url = res.url
      let name = res.name
      let actions = res.actions
      this.boundContractId = detailId
      // console.log(res)
      switch (type) {
        // 查看历史版本
        case 'getHistory':
          this.postHistoryData = {
            show: true,
            params: {
              url: res.url,
              formId: detailId
            }
          }
          break
        // 修改
        case 'update':
          // 显示详情弹窗
          this.showDetailDialog(type, {
            detailId: detailId,
            actions: actions
          })
          break
        // 查看
        case 'show':
          // 显示详情弹窗
          this.showDetailDialog(type, {
            detailId: detailId,
            actions: actions
          })
          break

        // 查看
        case 'download':
          // 显示详情弹窗
          this.sealDealHttps(url, `?id=${detailId}`, {}, () => {
            this.$messageSuccess('打开预览中!')
          })
          break

        // 上报、重新上报
        case 'report':
          this.$confirm('是否上报(重新上报)?', '提示', {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            type: 'info'
          }).then(() => {
            this.sealDealHttp(url, `?id=${detailId}`, () => {
              this.$messageSuccess('上报成功!')
            })
          }).catch(() => {
            console.log('请求出现错误');
          });
          break
        // 撤回上报
        case 'revokeReport':
          this.$prompt('撤回理由', '提示', {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
          }).then(({ value }) => {
            if (value === null || value === '') {
              this.$messageError('请填写撤回理由后重试')
              return
            }
            this.sealDealHttp(url, `?id=${detailId}&description=${value}`, () => {
              this.$messageSuccess('撤回成功！')
            })
          }).catch(() => {
            console.log('请求出现错误');
          });
          break
        // 删除
        case 'delete':
          if (detailId === '') {
            this.$messageError('请先选择要删除的记录！')
            return
          }
          this.$confirm('确定是否删除？', '提示', {
            confirmButtonClass: 'iconfont icon-icon_ok',
            cancelButtonClass: 'iconfont icon-guanbi',
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            type: 'info'
          }).then(() => {
            this.sealDealHttp(url, ``, {
              idList: detailId.split(','),
            }, () => {
              this.$messageSuccess('删除成功!')
            })
          }).catch(() => {
            console.log('请求出现错误');
          });
          break



        // 同意
        case 'agree':
          this.$prompt('请输入同意审批意见', '提示', {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
          }).then(({ value }) => {
            this.sealDealHttp(url, `?id=${detailId}&description=${value}`, () => {
              this.$messageSuccess('同意审批成功!')
            })
          }).catch(() => {
            console.log('请求出现错误');
          });
          break
        // 驳回
        case 'reject':
          this.$prompt('请输入驳回审批意见', '提示', {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
          }).then(({ value }) => {
            this.sealDealHttp(url, `?id=${detailId}&description=${value}`, () => {
              this.$messageSuccess('驳回审批成功!')
            })
          }).catch(() => {
            console.log('请求出现错误');
          });
          break

        // 查看
        case 'supervise':
          // // 显示详情弹窗
          // this.showDetailDialog(type, {
          //     detailId: detailId,
          //     actions: actions
          // })
          this.getChoosedContractList(this.boundContractId)
          this.dialogTableVisible = true
          break
      }
    },
    paginationChange(index) {
      this.search.pageIndex = index - 1
      this.getList()
    },
    del(ids) {
      if (ids === '') {
        this.$messageError('请先选择要删除的记录！')
        return
      }
      this.$confirm('确定是否删除？', '提示', {
        confirmButtonClass: 'iconfont icon-icon_ok',
        cancelButtonClass: 'iconfont icon-guanbi',
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'info'
      }).then(() => {
        let param = {
          ids: ids
        }
        assessment.del(param).then(res => {
          if (res.code === 200) {
            msgUtil.success2('删除成功!')
            this.getList()
          } else {
            msgUtil.error2(res.data.message)
          }
        })
      }).catch(() => {
        console.log('请求出现错误');
      });
    },
    // 事件处理的api请求
    sealDealHttp(url, query, param, callback) {

      if (!url.startsWith("http")) {
        url = url;
      }

      this.$httpPost(
        url + query,
        param
      ).then(res => {
        if (res.data.status === 1) {
          if (callback) callback(res.data)
          // 重新获取数据
          setTimeout(() => {
            this.getList(true)
          }, 1000)
        } else {
          this.$messageError(res.data.message)
        }
      }).catch(res => {
        console.log(res)
      })
    },
    handleSelectionChange(val) {
      this.selectedIds = []
      val.forEach(item => {
        this.selectedIds.push(item.id)
      })
    },
  },
  filters: {
    totalScore: totalScoreFilter
  }
}
</script>

<style scoped lang="scss">
.operate_wrap {
  height: 40px;
  width: 100%;
  box-sizing: border-box;
  .el-button,
  .el-select,
  .el-input {
    border-radius: 4px;
    font-family: PingFangSC-Medium;
    font-size: 14px;
    display: inline-block;
  }

  .el-date-editor--daterange {
    width: 300px;
  }

  .add {
    width: 88px;
  }

  .delete {
    width: 88px;
  }

  .search {
    width: 88px;
    color: #fff;
    margin-left: 10px;
  }

  .el-select {
    width: 180px;
    margin-left: 10px;
  }

  .input {
    width: 180px;
    margin-left: 10px;
    color: #3e556e;
  }
}

.list_wrap {
  margin-top: 20px;
}

.grid-box {
  display: grid;
  grid-template-columns: repeat(3, calc(33.3% - 15px));
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  .grid-one {
    background: #fff;
    border: 1px solid #e9e9e9;
    border-radius: 6px;
    .grid-content {
      padding: 20px 20px 0 20px;
      .gridA {
        display: flex;
        align-items: flex-start;
        margin-bottom: 10px;
      }
      .grid-1 {
        flex: 1;
        font-size: 18px;
        font-weight: bold;
        margin: 0 12px;
      }
      .score {
        font-size: 20px;
      }
      .gridB {
        display: flex;
        justify-content: space-between;
        align-items: center;
        font-size: 12px;
        color: rgba(0, 0, 0, 0.45);
      }
    }
    .grid-footer {
      padding: 20px;
      display: flex;
      justify-content: space-between;
      ::v-deep .el-button {
        width: 30%;
      }
    }
  }
}
</style>
